<template>
	<view>
		compiler
		<view class="h5">1. ifdef H5</view>
		<!-- #ifdef H5 -->
		<view class="h5">
			<view class="h5">show h5</view>
		</view>
		<!-- #endif -->

		<view class="weapp">2. weapp</view>
		<!-- #ifdef MP-WEIXIN || APP-PLUS -->
		<view class="weapp">
			<view class="weapp">
				show weapp
			</view>
		</view>
		<!-- #endif -->

		<view class="app">3. app</view>
		<!-- #ifdef APP-PLUS -->
		<view class="app">
			<view>show app</view>
			<image src="@/static/logo.png" />
		</view>
		<!-- #endif -->
	</view>
</template>

<script>
	export default {
		onLoad() {
			// #ifdef H5
			document.title = 'H5'
			// window.xxx
			// #endif

			// #ifdef MP-WEIXIN
			wx.setNavigationBarTitle({
				title: "WeApp"
			})
			// wx.login()
			// #endif
		},
		onReady() {
			// #ifdef APP-PLUS
			uni.setNavigationBarTitle({
				title: 'App'
			})
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: '#ff8198'
			})
			console.log('App ========> ');
			// #endif
		},
	}
</script>

<style>
	view {
		/* #ifdef H5 */
		color: red;
		/* #endif */

		/* #ifdef MP-WEIXIN */
		color: green;
		/* #endif */

		/* #ifdef APP-PLUS */
		color: blue;
		/* #endif */
	}
</style>